//LiuZh 2017-06-27
import React, { Component } from 'react';

import {
	View,
	Image,
	StyleSheet,
	Text,
	TouchableOpacity,
	TextInput,
	ScrollView,
	Dimensions
} from 'react-native';

import InitDB from '../database/init-db';
import Constant from '../constant/constant';
import ToastUtil from '../utils/toast-util';
import Http from '../utils/http.js';
import Color from '../constant/color';
var { Loading, EasyLoading } = require('react-native-easy-loading');
const SmartKeyboard = require('@remobile/react-native-smart-keyboard');

let winWidth = Dimensions.get('window').width;//屏幕宽度
let winHeight = Dimensions.get('window').height;//屏幕高度

export default class ResetPwdScene extends Component {

	constructor(props) {
		super(props);
		this.state = {
			username: null,
		}
	}

	componentDidMount() {
		let username = InitDB.getUserInfo('QST_CODE="username"')[0].OPT_VAL;
		this.setState({
			username: username
		})
	}

	gotoForgotPwd=()=>{
		const {navigate} = this.props.navigation
		const {username} = this.state
		navigate("ForgetPwd", { mobile: username })
	}

	render() {
        const {navigation} = this.props.navigation
		return (
			<View style={styles.top_view}>
				<View style={styles.box}>
					<TouchableOpacity
						onPress={() => { navigation.goBack() }}
						style={{ height: 50, width: 50, flexDirection: "row", justifyContent: 'flex-start', alignItems: 'center', position: 'absolute', left: 0, top: 0 }}>
						<Text style={{ color: '#ffffff' }}>取消</Text>
					</TouchableOpacity>
					<View style={{ flexDirection: "row", justifyContent: "center" }}>
						<Text style={[styles.text, this.props.textColor ? { color: this.props.textColor } : {}]} >修改密码</Text>
					</View>
					<TouchableOpacity style={{
						position: 'absolute', right: 0, top: 0, height: 50, width: 50,
						flexDirection: "row", justifyContent: "center",
					}}
						onPress={this.submit}
					>
						<Text style={{ color: this.state.current_password && this.state.current_password && this.state.new_password ? '#64ae55' : '#49574c', alignSelf: 'center' }}>完成</Text>
					</TouchableOpacity>
				</View>
				<ScrollView style={styles.body}>
					<View style={[styles.input_view, { marginTop: 15 }]}>
						<View style={{ flex: 1, }}><Text style={{ color: Color.TEXT_GREY }}>手机号</Text></View>
						<View style={{ flex: 3, }}><Text style={{ color: Color.TEXT_GREY }}>{this.state.username}</Text></View>
					</View>

					<View style={styles.input_view}>
						<View style={{ flex: 1, }}><Text style={styles.input_label}>旧密码</Text></View>
						<View style={{ flex: 3, }}>
							<TextInput
								placeholder={'请输入当前密码'}
								placeholderTextColor={'#CCC'}
								underlineColorAndroid="transparent"
								autoCapitalize="none"
								secureTextEntry={true}
								autoCorrect={false}
								onChangeText={(text) => { this.setState({ current_password: text }) }} />
						</View>
					</View>

					<View style={styles.input_view}>
						<View style={{ flex: 1, }}><Text style={styles.input_label}>新密码</Text></View>
						<View style={{ flex: 3, }}>
							<TextInput
								placeholder={'请输入当前密码'}
								placeholderTextColor={'#CCC'}
								underlineColorAndroid="transparent"
								autoCapitalize="none"
								secureTextEntry={true}
								autoCorrect={false}
								onChangeText={(text) => { this.setState({ new_password: text }) }} />
						</View>
					</View>

					<View style={styles.input_view}>
						<View style={{ flex: 1, }}><Text style={styles.input_label}>确认密码</Text></View>
						<View style={{ flex: 3, }}>
							<TextInput
								placeholder={'请再次输入新密码'}
								placeholderTextColor={'#CCC'}
								underlineColorAndroid="transparent"
								autoCapitalize="none"
								secureTextEntry={true}
								autoCorrect={false}
								onChangeText={(text) => { this.setState({ new2_password: text }) }} />
						</View>
					</View>
					<View style={styles.zhushi_view}>
						<Text style={styles.zhushi_text}>密码至少包含8个字符。</Text>
						<TouchableOpacity onPress={this.gotoForgotPwd}>
							<Text style={styles.forgot_text}>忘记旧密码?</Text>
						</TouchableOpacity>
					</View>
				</ScrollView>
			</View>
		)
	}

	submit=()=>{
		let checkNewPassword = this.state.new_password.length >= 8
		if (!checkNewPassword) {
			alert('密码至少包含8个字符。');
			return;
		}

		let checkNew2Password = this.state.new2_password && this.state.new_password === this.state.new2_password;
		if (!checkNew2Password) {
			alert('确认密码不得为空且必须与新密码相同');
			return;
		}

		Promise.resolve().then(EasyLoading.show('loading', 8000));
		let empId = InitDB.getCurrentUser().empId;
		let params = {
			oldPassword: this.state.current_password,
			newPassword: this.state.new_password,
		};
		//alert(params.mobile);
		Http.post_upload('updatePassword', empId, params)
			.then(res => {
				if (res.returnType.resultCode === '1') {
					ToastUtil.show("修改成功");
					Promise.resolve().then(EasyLoading.dismis());
					this.props.navigation.goBack();
				} else {
					ToastUtil.show('修改失败：' + res.returnType.resultMessage);
					Promise.resolve().then(EasyLoading.dismis());
				}


			}).catch(err => {
				//请求失败
				ToastUtil.show('修改密码失败，错误信息:' + err);
				Promise.resolve().then(EasyLoading.dismis());
			})
	}
}

const styles = StyleSheet.create({
	top_view: {
		height: winHeight,
	},
	body: {
		backgroundColor: Color.VIEW_BG_COLOR,
	},

	btn: {
        height: 40,
        marginTop: 50,
        marginLeft: 50,
        marginRight: 50,
        justifyContent: 'center',
        alignItems: 'center',
        borderRadius: 6,
        backgroundColor: '#00F',
	},
	box: {
        width: winWidth,
        height: 50,
        marginTop: 0,
        justifyContent: 'center',
        alignItems: 'center',
        borderBottomWidth: 0.5,
        borderColor: '#DDDDDD',
        backgroundColor: '#38373d',
        flexDirection: 'row',
	},
	back: {
        width: 20,
        height: 20,
	},
	text: {
		color: '#ffffff',
        alignSelf: "center"
    },
	input_view: {
        padding: 8,
        marginLeft: 0,
        marginRight: 0,
        marginTop: 0,
        marginBottom: 0,
        flexDirection: "row",
        justifyContent: "center",
        backgroundColor: "#ffffff",
        borderBottomWidth: 1,
        borderColor: Color.TEXTINPUT_LINE,
	},
	input_label: {
	},
	zhushi_view: {
        marginTop: 15,
        marginLeft: 15,
        marginRight: 15,
		marginBottom: 0,
	},
	zhushi_text: {
		color: Color.TEXT_GREY,
		fontSize: 14,
	},
	forgot_text: {
		color: Color.TEXT_HREF,
		fontSize: 14,
	}
})